<!DOCTYPE html>
<html>

	<head>
		<meta charset="utf-8" />
		<title>问题详情页</title>
		<link rel="stylesheet" type="text/css" href="/assets/css/common.css" />
		<link rel="stylesheet" type="text/css" href="/assets/css/normalize.css" />
		<link rel="stylesheet" href="/assets/css/pagination.css" />

		<style>
			body {
				font-family: "宋体";
				background-color: rgb(240, 240, 240);
				
			}
			
			.jx-content {
				margin: 0 150px;
				background-color: #fff;
				padding: 10px;
				height: 100%;
				padding-left: 100px;
			}
			
			.jx-search-box {
				margin: 0;
				width: 200px;
				height: 28px;
				border: 1px solid #BDBDBD;
				text-align: left;
			}
			
			.jx-search {
				float: right;
				margin-top: 20px;
			}
			
			.jx-search-button {
				display: inline-block;
				width: 32px;
				height: 32px;
				background: url(/assets/img/button.png);
			}
			
			.jx-col1 {
				display: inline-block;
				width: 15%;
				text-align: center;
			}
			
			.jx-col2 {
				display: inline-block;
				width: 45%;
				text-align: center;
			}
			
			.jx-col3 {
				display: inline-block;
				width: 20%;
				text-align: center;
			}
			
			.jx-col4 {
				display: inline-block;
				width: 15%;
				text-align: center;
			}
			
			.jx-th {
				background-color: #DFEBFB;
				padding: 5px 0;
				font-weight: bold;
			}
			
			.jx-list {
				font-size: 14px;
			}
			
			.jx-link {
				color: #3476a8;
				font-weight: bold;
			}
			
			.jx-td {
				border-bottom: 1px dashed #BDBDBD;
				padding: 5px 0;
			}
			
			.jx-pag {
				float: right;
				margin-top: 20px;
			}
			
			.jx-clear {
				clear: both;
			}
			
			.jx-qu-wrap {
				margin: 10px 30px;
				width: 600px;
			}
			
			.jx-qu-desc {
				font-size: 14px;
				line-height: 1.5rem;
				text-indent: 2rem;
			}
			
			.jx-qu-author {
				float: right;
				font-size: 12px;
				color: #999;
			}
			
			.jx-qu-header {
				width: 50px;
			}
			
			.jx-an-wrap {
				border-top: 1px solid #757575;
				margin: 10px 30px;
				width: 600px;
			}
			
			.jx-an-sum {
				font-family: "微软雅黑";
				color: #3476A8;
				font-weight: bold;
				font-size: 16px;
			}
			
			.jx-an-item {
				border-bottom: 1px dashed #757575;
				padding-top: 10px;
			}
			
			.jx-an-input {
				
				margin: 30px;
				border-radius: 5px;
				border: 1px solid #999999;
				width: 500px;
				height: 200px;
				word-wrap: break-word;
				padding: 15px;
				line-height: 1.5em;
			}
			.jx-an-button{
				display: block;
				-webkit-appearance: none;
				appearance: none;
        		-moz-appearance: none;
				width:60px;
				height:40px;
				border-radius: 5px;
				background-color: #3476A8;
				border:1px solid #3476A8;
				color:#fff;
				margin-left:500px;
				margin-bottom: 100px;
			}
			.jx-an-button:active{
				background-color: #073456;
			}
		</style>
	</head>

	<body>
		<div class="jx-content">
			<header><img class="jx-logo" src="/assets/img/logo.png" />
				<div class="jx-search"><input type="search" class="jx-search-box" placeholder="请输入关键字">
					<span class="jx-search-button"></span>
				</div>
			</header>
			<section class="jx-qu-wrap">

				<h3>&nbsp;&nbsp;&nbsp;&nbsp;$!{question.title}</h3>
				<div class="jx-qu-desc">
					$!{question.desc}
				</div>
				<div class="jx-qu-author">
					<img class="jx-qu-header" src="http://static.bojx.com/image/20161101/header.jpg" alt="" />
					<span>$!{question.depart_name}&nbsp;&nbsp;</span><span>$!{question.user_name}</span>
					<p>$!{question.create_time}</p>
				</div>
				<div class="jx-clear"></div>
			</section>
			<section class="jx-an-wrap">
				<p class="jx-an-sum">共$!{answers.size()}条回答</p>
				<ul>
				
				#foreach($!answer in $!answers)
					<li class="jx-an-item">
						<div class="jx-qu-desc">
							$!answer.desc
						</div>
						<div class="jx-qu-author">
							<img class="jx-qu-header" src="http://static.bojx.com/image/20161101/header.jpg" alt="" />
							<span>$!answer.depart_name </span><span>$!answer.user_name</span>
							<p>$!answer.create_time</p>
						</div>
						<div class="jx-clear"></div>
					</li>
				#end
					

				</ul>
			</section>
				<input id="question_id" type="hidden" value="$!{question.id}">
			    <textarea id="desc" class="jx-an-input">
					
					
				</textarea>
				<button id="answer" class="jx-an-button">
					回答
				</button>			
			</section>

			<div class="jx-clear"></div>
		</div>

		<script src="/assets/js/jquery.min.js" type="text/javascript" charset="utf-8"></script>
		<script>
			$(function(){
				$('#answer').click(function(){
				   var _id=$('#question_id').val();
				   var _desc=$('#desc').val();
				   $.post("/question/answerPost",{"id":_id,"desc":_desc},function(data){
						if(data.code=='00'){
							alert('提交成功');
							window.location.reload();
						}else{
							alert(data.msg);
						}
					   
				   },"json"
				   );
				});   
			});
		</script>
	</body>

</html>